<template>
<FormDrawer ref="formDrawerRef" @submit="handleSubmit" title="商品详情" destroyOnClose>
      <el-form :model="form">
            <el-form-item>
                <Editor v-model="form.content"/>
            </el-form-item>
        </el-form>
</FormDrawer>
</template>

<script setup>
import { reactive, ref } from "vue";
import ChooseImage from "~/components/ChooseImage.vue";
import FormDrawer from "~/components/FormDrawer.vue";
import Editor from "~/components/Editor.vue"
import {
  getProduct,
  createProduct,
  updateProduct,
  deleteProduct,
  getOneProduct,
} from "~/api/product.js";
import { toast } from "~/composables/util";
const formDrawerRef = ref(null)

const form = reactive({
    content:"",
})

const productId = ref(0);
const open = (row) => {
  productId.value = row.id;
  getOneProduct(productId.value).then((res) => {
    
    form.content = res.content;
  });
  formDrawerRef.value.open()
};

const emit=defineEmits('reloadData')
const handleSubmit = () => {
  
  updateProduct(productId.value,form).then(res=>{
    toast('設置成功')
    formDrawerRef.value.close()
    emit('reloadData')
  })
};
defineExpose({
  open,
});
</script>
